																<!--未登录时首页-->
<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>码虫</title>
	<link th:href="@{/mb/css/bootstrap.min.css}" rel="stylesheet" type="text/css">
	<link th:href="@{/mb/css/css.css}" rel="stylesheet" type="text/css">
	<link th:href="@{/mb/css/Animation.css}" rel="stylesheet" type="text/css">
	<link rel="stylesheet" type="text/css" th:href="@{/style/container.css}">
<style type="text/css">
	.button{
		height: 50px;
	    width: 300px;
	    border: none;
	    font-size: 30px;
	    border-radius: 4px;
	    background-color: blue;
	    color: white;
	}
</style>
</head>
<body>
<!--头开始-->
<header class="navbar-fixed-top headerbg">
	<div class="logo"><a href="http://www.baidu.com" th:href="@{/mc/}" class="fl mt10">
		<img th:src="@{/mb/images/mclogo.png}" style="margin-top: -30px;margin-left: 30px" alt=""></a></div>
	<div class="navBox hidden-xs hidden-sm"  style="float: right;margin-right: 10%">
		<ul class="navList list-unstyled">
			<li class="navLi on"><h3><a href="http://www.baidu.com" th:href="@{/mc/}" ><span>首页</span></a></h3></li>
			<li class="navLi"><h3><a href="http://www.baidu.com" th:href="@{/mc/item/itemsList}"><span>项目</span></a></h3></li>
			<li class="navLi"><h3><a href="javascript:click()" ><span>帮助</span></a></h3></li>
			<li class="navLi"><h3><a href="http://www.baidu.com"  th:href="@{/mc/login}"><span>登录</span></a></h3></li>
			<li class="navLi"><h3><a href="http://www.baidu.com" th:href="@{/mc/register}"><span>注册</span></a></h3></li>
			<li class="navLi" style="overflow: hidden;display: none"><h3><a href="javascript:click()"><img th:src="@{/images/center.png}" height="60px" width="60px"></a></h3></li>
		</ul >
	</div>
</header>
<!--头结尾-->
<!--动态线条-->
<div class="bannerN animated">
	<div class="imgFull"><img  class="img-responsive" th:src="@{/mb/images/ab_bg_01.png}"></div>
	<div class="clouds_one"></div>
	<div class="clouds_two"></div>
	<div class="clouds_three"></div>
</div>
<!--动态线条结尾-->
<!--流程开始-->

<div style="text-align: center;">
	<div>
		<p style="text-align: center;font-size: 30px;margin-top: 50px;margin-bottom: 30px;">码虫交易与服务流程<br /></p>
	</div>
	<div style="height: 340px;margin-left: 10%;">x`
		<div style="height: 340px;float: left;margin-left: 200px;border-bottom: 1px solid gainsboro;">
			<h6 style="margin-top: 60px;">//01</h6>
			<p style="font-size: 40px;margin: 20px;">发布需求</p>
			<p>不知道项目如何报价？</p>
			<p>在这里可以快速估价</p>
			<p>覆盖web、App、微信公众号等常用功能</p>
		</div>
		<div style="height: 340px;float: left;border-bottom: 1px solid gainsboro;">
			<img th:src="@{/images/index-content-slice-1.png}" width="600px",hheight="240px" style="vertical-align: middle;" />
		</div>
	</div>
	<div style="height: 340px;margin-left: 10%;">
		
		<div style="height: 340px;float: left;border-bottom: 1px solid gainsboro;margin-left: 200px;">
			<img th:src="@{/images/index-content-slice-2.png}" width="600px",hheight="240px" style="vertical-align: middle;" />
		</div>
		<div style="height: 340px;float: left;border-bottom: 1px solid gainsboro;">
			<h6 style="margin-top: 60px;">//02</h6>
			<p style="font-size: 40px;margin: 20px;">确认合作</p>
			<p>海量开发者，技能多样化</p>
			<p>实现技能需求匹配</p>
			<p>确认合作开发者</p>
		</div>
	</div>
	<div style="height: 340px;margin-left: 10%;">
		<div style="height: 340px;float: left;margin-left: 200px;border-bottom: 1px solid gainsboro;">
			<h6 style="margin-top: 60px;">//03</h6>
			<p style="font-size: 40px;margin: 20px;">资金托管</p>
			<p>项目款分阶段托管，自助验收支付开发者</p>
			<p>全方位保障开发进度</p>
			<p>全方位保障合作的可信度</p>
		</div>
		<div style="height: 340px;float: left;border-bottom: 1px solid gainsboro;">
			<img th:src="@{/images/index-content-slice-3.png}" width="600px",hheight="240px" style="vertical-align: middle;" />
		</div>
	</div>
	<div style="height: 340px;margin-left: 10%;">
		
		<div style="height: 340px;float: left;margin-left: 200px;">
			<img th:src="@{/images/index-content-slice-4.png}" width="600px",hheight="240px" style="vertical-align: middle;" />
		</div>
		<div style="height: 340px;float: left;">
			<h6 style="margin-top: 60px;">//04</h6>
			<p style="font-size: 40px;margin: 20px;">互相评价</p>
			<p>项目完成后，可以互相评价</p>
			<p>好的评价更容易接到项目哦</p>
			
		</div>
	</div>
	
</div>

<div style="background-color: gainsboro;height: 460px;">
	<p style="text-align: center;font-size: 35px;">看看他们怎么说</p>
	<div style="float: left;background-color: white;height: 320px;width: 280px;margin-left: 11%;" th:each="advise:${adviseList}">

		<div style="height: 180px;">
			<p style="font-size: 16px;line-height: 30px;color: lightgrey;"th:text="${advise.messageContent}">“在码市平台，找到的开发者很靠谱，也很及时;我们项目赶时间，码市确实起到了非常大的帮助。”</p>
		</div>

		<div style="margin-left: 110px;margin-bottom: 20px;margin-top: 10px;">
			<span th:if="${advise.image}">
			<img  th:src="@{'/article/'+ ${advise.image}}" width="40px" height="40px" style="vertical-align: middle;"/>
			</span>
			<span th:unless="${advise.image}">
	<img th:src="@{/images/center.png}" width="40px" height="40px" style="vertical-align: middle;"/>
			</span>
		</div>

		<div style="text-align: center;line-height: 20px;">
			<span th:text="${advise.nickName}">罗涛</span><br />
			<span th:text="${advise.type==1 ? '开发者':'需求者'}">CEO</span>
		</div>

	</div>

</div>




<!--联系我们-->
<div class="contact-container">
	<div class="contact-connect-container">
		<div class="button-container">
			<img th:src="@{/images/contacts.png}"/><span style="margin-left: 5px;">联系我们</span>
		</div>
		<div class="pop" style="display: none;">
			<div class="word" style="text-align: center;"><span style="font-size: 12px;">在线咨询请扫描下面二维码👇</span></div>
			<div style="height: 120px;width: 120px;margin:20px 22px;">
				<img th:src="@{/images/QR.jpg}" style="width: 120px;height: 120px;margin-top: -15px;"/>
			</div>
		</div>
	</div>
</div>



<footer class="footerBg">
	<div class="container"><span class="footer_logo"><img th:src="@{/mb/images/mclogo.png}"></span><span class="CopyRight_name">码虫互联网服务外包平台 </span></div>
</footer>
</body>
<script th:src="@{/mb/js/jquery-3.3.1.min.js}" type="text/javascript"></script>
<script th:src="@{/mb/js/jquery.js}" type="text/javascript"></script>
<script type="text/javascript" th:src="@{/js/Contacts.js}"></script>
<!--引入-->

<script type="text/javascript">
    function click()
    {
        window.alert("请先登录账号！");
    }
</script>

</html>
